<template>
  <div class="pp" style="padding: 0 30px; flex: 1">
    <div v-for="(item, index) in articleArr" :key="item.id">
      <p style="font-weight: bolder; padding: 15px 0">{{ item.text }}</p>
      <p
        @click="
          changepath(
            item2.path,
            item2.text,
            item2,
            item2.classifyname,
            item2.jutibiaoti
          )
        "
        class="pad"
        v-for="(item2, index) in item.children"
        :key="item2.id"
      >
        {{ item2.text }}
      </p>
    </div>
  </div>
</template>

<script setup lang="ts">
let router = useRouter();
import filterArr from "~/utils/filter";
import type { articleType } from "../types/articleType";
let articleArr = ref<articleType>();

let res = await useFetch("/api/articleRight");

let arr = filterArr(res.data.value?.message);
articleArr = arr;

// console.log(articleArr, "article");
async function changepath(
  path: string,
  title: string,
  item2: any,
  classifyname: any,
  jutibiaoti: any
) {

  
  if (jutibiaoti) {
    console.log(path,title,'shabi565');
    // router.push(path+'/'+title)
    await navigateTo({
      path: `${path}/${title}`,
      query: {
        dateTitle: `${title}`,
      },
    });
    setTimeout(() => {
    router.go(0);
      
    }, 300);
  }
  // router.push({ path: path });
  // console.log('title',item2,path,classifyname);
  else if (classifyname) {
    await navigateTo({
      path: `${path}`,
      query: {
        classifyname: `${title}`,
      },
    });
    router.go(0);
  } else {
    console.log(path, 11111);
    await navigateTo({
      path: `${path}`,
      query: {
        dateTitle: `${title}`,
      },
    });
    router.go(0);
  }

  //给路由传递数据
}
</script>

<style scoped>
* {
  padding: 0;
  margin: 0;
}
.pad {
  cursor: pointer;
  padding: 5px 0px;
  color: #999;
  font-size: 14px;
  cursor: pointer;
}
@media (min-width: 150px) and (max-width: 700px) {
  p {
    text-align: center;
  }
}
</style>
